@use "../../../vars.scss";

.sidebar_menu_item_container {
  display: flex;
  flex: 0 0 auto;
  flex-flow: row;
  justify-content: flex-start;
  flex-shrink: 0;
  align-items: baseline;

  padding: 0.75rem 1rem;

  transition: vars.$short-duration;
  letter-spacing: 0.5px;

  font-size: 1.25rem;
  font-variant: small-caps;

  &:hover {
    background: vars.$bgdarker;
  }

  i {
    margin: 0 0.5em 0 0;
  }

  span {
    margin-right: 0.75rem;
  }
}

.left_panel:not(.compact_panel) .sidebar_menu_item_container .fa {
  width: 20px;
}
